<div ng-controller="chanCtr">
    <div class="spTop">
        <a onClick="javascript: history.go(-1);" class="glyphicon glyphicon-chevron-left"></a>
        <a href="#" class="peronHom">频道定制</a>
    </div>
    <div id="colums">
        <div class="chanSel">
            <div class="chanTi">
                <h5>已选频道</h5>
                <span>点击删除</span>
            </div>
            <ul class="chanCon" id="chanDeles">
                <li ng-repeat="item in mos" ng-click="chanDelet($index)">{{item.title}}</li>
            </ul>
        </div>
        <div class="chanMor">
            <div class="chanTi">
                <h5>更多频道</h5>
                <span>点击添加更多栏目</span>
            </div>
            <ul class="chanCon" id="chanAdds">
                <li ng-click="chanAdd($index)" ng-repeat="item in los">{{item.title}}</li>
            </ul>
        </div>
    </div>
</div>

<style>
    #colums{
        padding:10px  20px;
    }
    .chanTi:after,.chanMor:after,.chanSel:after{
        display: block;
        content: "";
        clear: both;
    }
    .chanMor,.chanSel{
        padding: 10px 0;
    }
    .chanTi h5,.chanTi span{
        float:left;
        display: inline-block;
    }
    .chanTi h5{
       font-weight: 700;
       color: #000;
    }
    .chanTi span{
       margin-left:30px ;
    }
    .chanMor{
        padding: 0 5px;
    }
    .chanCon li{
        float: left;
        width:60px;
        height:30px;
        margin:10px;
        background: #eee;
        text-align: center;
        line-height: 30px;
        border: 2px solid #e3e3e3;
        color: #000;
    }
    .chanCon li:hover{
        background: red;
        color: #fff;
    }
    .chanTi{
        height: 30px;
        margin: 5px 0;
        border-bottom: 1px solid #eee;
    }
</style>